/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */

/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, nav, section {
	display: block;
}

audio, canvas, video {
	display: inline-block;
}

audio:not([controls]) {
	display: none;
}

[hidden] {
	display: none;
}

/**/
/* =============================================================================
   Base
   ========================================================================== */
:focus, .multiSelect .multiselect.btn:focus {
	border-radius: 6px;
	-webkit-border-radius: 6px;
}

input:focus, .form-control:focus, input.select2-input {
	outline: none;
	box-shadow: 0 0 0 2px #3c96c3;
}

.btn-orange-wft:focus {
	outline: 2px solid #56B4E9;
}

th.sorting_asc:focus {
	outline-offset: -2px;
}

div:focus,
span:focus,
fieldset:focus,
.navbar-nav li:focus {
	outline: 2px solid #0072B2;
	box-shadow: none;
}

.dropdown-menu li:focus,
.list-group-item:focus {
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.modal-content:focus,
.list-group-item:focus {
	outline: none;
}

a:focus,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline-offset: -2px;
}

.selected .sortableDragHandle:focus, .selected .sortableDragHandleUpDown:focus, .inputFieldDivReadOnly .selectedRow button:focus, .calendarHeader .dayOfWeek:focus, #stratXRulesWrapper .selected .focusElement:focus {
	outline: 2px solid #3C96C3;
}

.calendarActive .dayOfWeek:focus {
	outline: 2px solid #D6EAFF;
}

.preferenceSetContainer .sortableTitle button:focus, .finderColumn .plainTextLink:focus, .finderColumn .form-control:focus, .inputFieldTableReadOnly thead th input:focus {
	outline: 2px solid #0072B2;
}

div.selectable:focus, span.selectable:focus, .templateContainer:focus, .dayOfWeek:focus, .tableGrid thead th.sorting:focus, .tableGrid thead th.ajax_th:focus, .dataTables_scrollHead th:focus {
	outline: 3px solid #3C96C3;
}

.collapser:focus, .tableGrid tr:focus, .rosterTableList td > div:focus, .rosterCategory td > div > div:nth-child(n+2):focus, .positionItem .positionColumn:focus, .positionItem .iconColumn:focus,
.shiftTimes:focus, .shiftDuration:focus, .positionItem .idColumn:focus, .exceptionColumn.nonVacancy:focus, .preferenceTypeTitle a:focus {
	outline-offset: 1px;
}

.sortable li:focus, .dropdown-menu > li > a:focus, .finderColumn a:focus, .breadcrumbTrail:focus, .multiSelector .select2-container-multi .select2-choices .select2-search-field input:focus {
	outline-offset: -1px;
}

.sortableTable .sortable li:nth-child(even):focus {
	outline-offset: 0;
}

.limitByLink:focus, .filterByLink:focus, .subLinkLvl2:focus, .multiDaySchedule .cal-row-head .cal-cell1:focus,
.DataTables_sort_icon:focus, .eventListItem.list-group-item:focus, a.iconTextLinkInvisibleDeleteSmall:focus, .jQueryTabs > li > a:focus, .dayOfWeek:focus, .moreTableMenu:focus {
	outline-offset: -2px;
}

.exceptionSelector:focus {
	outline-offset: -5px;
}

.panelCollapsible .panel-title:focus, .noneAvailable:focus, .jQueryTabs > li:focus {
	outline: none;
}

.dayOfWeek:focus, .jQueryTabs > li > a:focus {
	box-shadow: none;
}

	/*
     * Remove text-shadow in selection highlight: h5bp.com/i
     * These selection declarations have to be separate
     * Also: hot pink! (or customize the background color to match your design)
     */

::-moz-selection {
	background: #293e6b;
	color: #fff;
	text-shadow: none;
}

::selection {
	background: #293e6b;
	color: #fff;
	text-shadow: none;
}

/* =============================================================================
   Links
   ========================================================================== */

a {
	color: #333;
	text-decoration: none;
}

a:hover {
	color: #005680;
	text-decoration: underline;
	cursor: pointer;
}

/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active {
	outline: 0;
}

/* =============================================================================
   Typography
   ========================================================================== */
hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 5px 0;
	padding: 0;
}

small {
	font-size: 75%;
	line-height: 125%;
}

/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between img and borders on image containers: h5bp.com/i/440
 */

img {
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: middle;
}

/*
 * Correct overflow not hidden in IE9
 */

svg:not(:root) {
	overflow: hidden;
}

/* =============================================================================
   Forms
   ========================================================================== */

form {
	margin: 0;
}

fieldset {
	border: 0;
	margin: 0;
}

/* Indicate that 'label' will shift focus to the associated form element */
label {
	cursor: pointer;
}

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea {
	margin: 0;
	vertical-align: baseline;
	line-height: normal;
}

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button::-moz-focus-inner, input::-moz-focus-inner, input[type="button"]::-moz-focus-inner {
	padding: 0;
	margin: 0;
	border: 0;
}

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

button, input[type="button"], input[type="reset"], input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
	vertical-align: middle;
}

/*
 * Re-set default cursor for disabled elements
 */

button[disabled], input[disabled] {
	cursor: default;
}

/*
 * Consistent box sizing and appearance
 */

input[type="search"] {
	-webkit-appearance: textfield;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

textarea {
	overflow: auto;
	vertical-align: top;
	resize: vertical;
}

/* =============================================================================
   Tables
   ========================================================================== */

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td {
	vertical-align: top;
}

/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe {
	margin: 0.2em 0;
	background: #ccc;
	color: black;
	padding: 0.2em 0;
}

/*HIDE GOOGLE TRANSLATE BAR*/
.goog-te-banner-frame.skiptranslate {
	display: none !important;
}

/* ==|== primary styles =====================================================
   Author:
   ========================================================================== */
* {
	margin: 0;
	padding: 0;
}

html, body {
	font-family: "Noto Sans Display", -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
	border: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

body {
	-ms-user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	user-select: none;
}

html {
	line-height: 120%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-ms-overflow-style: scrollbar;
}

/*WFD integration displays in iframe*/
html.inIframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#wrapper.navigationHidden {
	overflow: auto;
	height: 100%;
}

header {
	margin: 0;
	position: relative;
	cursor: default;
}

.headerContainer {
	cursor: default;
	padding: 0;
	margin: 0;
}

.footerContainer {
	height: 10px;
	padding: 0;
	margin: 0;
	position: fixed;
	bottom: 0;
}

.branding, .branding.navbar-brand {
	background-image: url('../../img/common/kronos-icons/UKG-teal-sm.svg');
	background-repeat: no-repeat;
	background-position: 6px 6px;
	display: inline-block;
	min-height: 35px;
	width: 145px;
	outline: none;
	height: auto;
}

@media (max-width: 767px) {
	.branding {
		margin-left: -5px;
	}
}

.errorPage .branding, .errorPage .branding.navbar-brand {
	background-image: none;
	background-color: #fff;
}

.environment {
	font-weight: normal;
	font-size: 90%;
	display: block;
	clear: left;
	text-transform: uppercase;
	cursor: default;
	text-align: left;
	margin-left: 10px;
	max-width: 135px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.userLogin, .logout {
	float: right;
	min-width: 100px;
	line-height: 100%;
	white-space: normal;
	max-height: 60px;
	margin-top: 5px;
	cursor: default;
	position: relative;
	text-align: right;
}

.modal-open .userLogin, .modal-open .logout {
	z-index: inherit;
}

.logout {
	margin-top: 17px;
}

.username {
	max-width: 200px;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 0;
	font-size: 90%;
	line-height: 120%;
	display: block;
	padding-bottom: 5px;
}

/*SYSTEM TIMEOUT INFO*/
#idletimeout {
	color: #ffffff;
	text-align: center;
	font-size: 100%;
	padding: 15px;
	background-color: #D34001;
	box-shadow: 0 1px 2px #666;
	position: fixed;
	width: 100%;
	min-width: 100%;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100000;
	display: none;
}

#idletimeout a, #idletimeout a:hover {
	color: #FFFFCA;
	padding-left: 3px;
	text-decoration: underline;
}

#idletimeout .countdown {
	font-weight: bold;
	color: #FFFFCA;
}

/*Background Task Status bar */
#notificationBar, #syncScheduleMessage, #showSyncScheduleNotification {
	display: none;
}

/*SYSTEM HELP BANNER */
.helpBanner {
	background: #293e6b;
	background: linear-gradient(to bottom, #2e4a85, #293e6b);
	position: relative;
	display: block;
	top: 0;
	left: 0;
	right: 0;
	padding: 0 0 0 10px;
	z-index: 100000;
	height: 30px;
	min-width: 950px;
	font-size: 85%;
	text-align: left;
}

.helpIdentifier {
	padding: 10px 10px 10px 220px;
	margin-top: -2px;
	color: #ccc;
	display: inline-block;
	vertical-align: top;
	width: 50%;
	text-align: right;
}

.helpBanner .helpIdentifier .helpLabel {
	font-size: 100%;
	margin: 0;
}

.dynamicID, .userSelect {
	-moz-user-select: text;
	-webkit-user-select: text;
	-ms-user-select: text;
	user-select: text;
}

.userSelect {
	cursor: text;
}

.helpSearchTool {
	width: 45%;
}

.helpSearchTool {
	text-align: left;
}

.helpSearchTool .helpLabel {
	float: left;
	margin: 6px 0 0 0;
}

input[type=text].helpSearch, input[type=text].helpSearch:active, input[type=text].helpSearch:focus, input[type=text].helpSearch:hover,
input.helpSearch, input.helpSearch:active, input.helpSearch:focus, input.helpSearch:hover {
	font-size: 100%;
	max-width: 250px;
	display: inline-block;
	clear: none;
	height: auto;
	margin: -5px 5px 0 5px;
	float: right;
	padding: 0 0 0 10px;
}

.helpSearchTool .buttonSave {
	float: left;
	margin-top: 5px;
}

#wrapper {
	margin: 0;
}

.institutionTag.btn-link, .institutionTag.btn-link:hover, .institutionTag.btn-link:focus {
	box-shadow: none;
	max-width: 150px;
	padding: 0;
	text-decoration: none;
	font-size: 90%;
}

.institutionTag.btn-link:focus {
	outline-offset: -2px;
}

.institutionTag .institution {
	max-width: 134px;
	overflow: hidden;
	text-overflow: ellipsis;
	outline: none;
	display: inline-block;
	margin-top: 0;
	line-height: 135%;
	vertical-align: middle;
	font-size: 105%;
}

.institutionFocus li {
	text-align: left;
}

.vertical {
	background: #ccc;
	width: 1px;
	max-width: 1px;
	height: 24px;
	padding: 0;
	margin: 0 3px;
	display: inline-block;
	cursor: default;
	vertical-align: middle;
}

.verticalEmptySpace {
	width: 5px;
	padding: 0;
	margin: 0;
	display: inline-block;
}

/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir {
	display: block;
	border: 0;
	text-indent: -999em;
	overflow: hidden;
	background-color: transparent;
	background-repeat: no-repeat;
	text-align: left;
	direction: ltr;
	*line-height: 0;
}

.ir br {
	display: none;
}

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden, .printOnly {
	display: none !important;
	visibility: hidden;
}

/* Hide control permanently so no javascript logic is supposed to show it again*/
.constantlyhidden {
	display: none !important;
	visibility: hidden;
}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

@media (max-width: 767px) {
	.visuallyhidden-xs {
		/* .visually-hidden styles for phones*/
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		height: 1px;
		overflow: hidden;
		position: absolute;
		white-space: nowrap;
		width: 1px;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	/* Hide only visually for ipad size, but have it available for screenreaders */
	.visuallyhidden-sm {
		border: 0;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
}

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

/* Hide visually and from screenreaders, but maintain layout */

.invisible, .hidden {
	visibility: hidden;
}

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

.form-control[disabled] {
	color: #545454 !important;
}

/*LOADING SPINNER*/
.opacitySpinBG {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #fff;
	z-index: 99;
	opacity: 0.1;
	cursor: wait;
	position: relative;
	pointer-events: none;
}

.disablePointerEvents {
	pointer-events: none;
}

.opacitySpinBGRoster {
	background-color: #fff;
	z-index: 99;
	opacity: 0.1;
	cursor: wait;
	pointer-events: none;
}

.spinner {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
}

.spinnerLarge {
	background-image: url('../../img/common/template/ajax_loader_gray.gif');
	background-repeat: no-repeat;
	background-position: center center;
	height: 60px;
	width: 60px;
	display: inline-block;
}

.dropDownList.institutionFocus .spinner {
	position: absolute;
	float: left;
}

.inputColumns .spinner, .leftPanel .spinner, .peopleFilterFormContainer .spinner {
	margin: 25%;
	padding-left: 50%;
}

.inputColumns .jQueryTab .spinner {
	padding-left: 0;
}

.peopleFilterFormContainer .spinner {
	margin-top: 150%;
}

.shiftCalendar .spinner {
	padding-right: 50%;
	margin-right: 50%;
	left: 50%;
}

.spinnerSmall {
	height: 100%;
	width: 100%;
	display: none;
}

#loading {
	text-align: center;
}

#loading div {
	display: inline-block;
}

#loading span:nth-child(2), #loading span:nth-child(3), #loading span:nth-child(4) {
	-webkit-animation-name: opacity;
	-webkit-animation-duration: 1s;
	-webkit-animation-iteration-count: infinite;
	-moz-animation-name: opacity;
	-moz-animation-duration: 1s;
	-moz-animation-iteration-count: infinite;
	animation-name: opacity;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

#loading span:nth-child(3) {
	-webkit-animation-delay: 200ms;
	-moz-animation-delay: 200ms;
	animation-delay: 200ms;
}

#loading span:nth-child(4) {
	-webkit-animation-delay: 300ms;
	-moz-animation-delay: 300ms;
	animation-delay: 300ms;
}

@-webkit-keyframes opacity {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@-moz-keyframes opacity {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

@keyframes opacity {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}

/*GENERIC/HELPER STYLES*/
.left, .leftClear {
	float: left;
	clear: none;
	display: inline-block;
	width: auto;
}

.leftClear {
	clear: left;
}

.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

.right, .rightClear {
	float: right;
	clear: none;
	display: inline-block;
	width: auto;
}

.rightClear {
	clear: right;
}

label.subHeader.clearNone, .clearNone {
	width: auto;
}

.clearNone {
	clear: none;
}

.clearBoth {
	clear: both;
}

.floatNone {
	float: none;
}

.overflowHidden {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: block;
}

.whitespaceNoWrap {
	white-space: nowrap;
}

.overflowHidden.whitespaceNormal {
	white-space: normal;
}

.overflowVisible, .dynamicText.overflowVisible, .headerTitle.overflowVisible {
	overflow: visible;
}

.overflowAuto, .inputFieldTableReadOnlyWrapper.noMaxHeight.overflowAuto {
	overflow: auto;
}

.alignTop, .input-group-btn.alignTop {
	vertical-align: top;
}

.alignMiddle {
	vertical-align: middle;
}

.alignBottom {
	vertical-align: bottom;
}

.indent {
	padding-left: 10px;
}

.indentSmall {
	padding-left: 5px;
}

.indentLarge {
	padding-left: 30px;
}

.indentLeftMargin2px {
	margin-left: 2px;
}

.unindent {
	margin-left: -10px;
}

.unindentSmall {
	margin-left: -5px;
}

.unindentMarginRight {
	margin-right: -10px;
}

.unindentRightSmall {
	margin-right: -5px;
}

.noRightMargin {
	margin-right: 0;
}

.noLeftMargin, .inputColumnHalfDiv.noLeftMargin {
	margin-left: 0;
}

.outdent {
	padding-right: 10px;
}

.outdent8px {
	padding-right: 8px;
}

.outdentSmall {
	padding-right: 5px;
}

.padded {
	padding: 10px;
}

.paddedBottom {
	padding-bottom: 10px;
}

.paddedBottomSmall {
	padding-bottom: 5px;
}

.paddedBottomNone {
	padding-bottom: 0;
}

.paddedScrollHelper, .inputColumns.paddedScrollHelper {
	padding-bottom: 150px;
}

.paddedTopLarge {
	padding-top: 20px;
}

.paddedTop {
	padding-top: 10px;
}

.paddedTopSmall {
	padding-top: 5px;
}

.paddedTopMargin3px {
	padding-top: 3px;
}

.fontSize85 {
	font-size: 85%;
}

.centerAlign {
	display: flex;
	align-items: center;
}

.selfAlignEnd {
	align-self: end;
}

.subLinkFlex {
	display: flex !important;
	flex-shrink: 0;
	flex-basis: 100%;
	padding-left: 15px !important;
}

.divFlex {
	display: flex;
	justify-content: space-between;
	flex-basis: 100%;
	flex-wrap: wrap;
	word-break: break-all;
}

.flexBreak {
	flex-basis: 100%;
	height: 0;
}

.selfAlignCenter5px {
	margin-left: 5px;
	align-self: center;
}

.fontStyleMargin3px {
	font-style: normal;
	margin-right: 3px;
}

.paddingLeft31px {
	padding-left: 31px !important;
}

.paddingLeft13px {
	padding-left: 13px !important;
}

.paddingLeft2px {
	padding-left: 2px;
	OVERFLOW-WRAP: BREAK-WORD;
}

.paddingLeftRight {
	padding-left: 31px !important;
	padding-right: 13px !important;
}

.alignSelfMarginTop {
	align-self: flex-start;
	margin-top: 5px !important;
}

.paddedTopNone {
	padding-top: 0;
}

.paddedSmall, .panelCollapsible .panel-body.paddedSmall, .sortableWrapper .sortableTitle.paddedSmall {
	padding: 5px;
}

.paddedLeftSmall {
	padding-left: 5px;
}

.extraPadding, .paddingMinimal {
	padding: 5px 10px;
}

.indentMargin {
	margin-left: 10px;
}

.indentMarginDouble, ul.noBulletList.indentMarginDouble {
	margin-left: 20px;
}

.indentMargin15px {
	margin-left: 15px;
}

.indentMargin25px {
	margin-left: 25px;
}

.indentMarginSmall {
	margin-left: 5px;
}

.indentMarginRight {
	margin-right: 10px;
}

.paddingRightDouble {
	padding-right: 20px;
}

.indentMarginRightDouble {
	margin-right: 20px;
}

.indentMarginRightSmall {
	margin-right: 5px;
}

.topMargin {
	margin-top: 10px;
}

.topMargin25px {
	margin-top: 25px;
}

.topDoubleMargin {
	margin-top: 20px;
}

.removeTopMargin {
	margin-top: -10px;
}

.removeTopMarginSmall {
	margin-top: -5px;
}

.removeTopMargin15 {
	margin-top: -15px;
}

.removeTopMargin20 {
	margin-top: -20px;
}

.removeTopMargin1 {
	margin-top: -1px;
}

.topMargin2px {
	margin-top: 2px;
}

.topMarginExtraSmall {
	margin-top: 3px;
}

.topMarginSmall {
	margin-top: 5px;
}

.bottomMargin {
	margin-bottom: 10px;
}

.bottomMarginSmall, .list-group.bottomMarginSmall {
	margin-bottom: 5px;
}

.removeBottomMargin20 {
	margin-bottom: -20px;
}

.topBottomMargin {
	margin-top: 10px;
	margin-bottom: 10px;
}

.topBottomDoubleMargin {
	margin-top: 20px;
	margin-bottom: 20px;
}

.topBottomMarginSmall {
	margin-top: 5px;
	margin-bottom: 5px;
}

@media (min-width: 768px) {
	.topMarginDesktop {
		margin-top: 10px;
	}
}

.noPadding, .noPadding[class*="col-"], .sortableWrapper .sortableTitle.noPadding, .inputFieldDivReadOnly .panel-default > .panel-heading.customHeaderStyles.noPadding {
	padding: 0;
}

.noMargin, .form-group.noMargin, .noMargin .form-group, .checkbox.noMargin, label.noMargin, .list-group.noMargin, .panel.noMargin, .pagination.noMargin {
	margin: 0;
}

.checkbox.noPadding label {
	padding: 0;
}

.noTopMargin, .ui-widget input.noTopMargin {
	margin-top: 0;
}

.fullWidth, input.fullWidth, input[type=password].fullWidth, input[type=text].fullWidth, .inputFieldTabs.fullWidth, select.fullWidth, .errorBelow.fullWidth {
	width: 100%;
}

textarea.fullWidth, .smallerMarginWidth, .tableGrid textarea.fullWidth {
	width: calc(100% - 5px);
}

.marginWidth, .sortable.marginWidth {
	float: left;
	width: calc(100% - 20px);
	min-width: 0;
}

.smallMarginWidth, .mainFixedContent.smallMarginWidth {
	float: left;
	width: calc(100% - 10px);
}

.widthAuto, .checkboxUnit.widthAuto {
	width: auto;
}

.widthAuto label, label.widthAuto, .checkboxUnit.widthAuto label, .widthAuto .checkboxUnit label {
	width: auto;
	margin-right: 5px;
	white-space: nowrap;
}

.minWidthAuto {
	min-width: initial;
}

.fullHeight {
	height: 100%;
}

.heightAuto {
	height: auto;
}

.minHeightAuto {
	min-height: initial;
}

.displayNone, .hidden, .hide, .plainTextLink.displayNone, .systemMessage.displayNone, a.plainTextLink.displayNone {
	display: none;
}

.displayInlineStyle {
	display: inline;
}

.displayInlineBlockStyle, .pulldownSelect.displayInlineBlockStyle, .pulldownSelect.dropdown.displayInlineBlockStyle {
	display: inline-block;
}

.displayBlock, .form-group label.displayBlock {
	display: block;
}

.displayHidden, .invisible {
	visibility: hidden;
}

.displayTable {
	display: table;
}

.displayTableCell {
	display: table-cell;
}

.displayFlex, .buttonsTopContent.displayFlex, .popUpButtonBar.displayFlex, .btn-group.displayFlex, .checkbox.displayFlex {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

.displayInlineFlex {
	display: -webkit-inline-flex;
	display: inline-flex;
}

.flexAlignCenter {
	-ms-flex-align: center;
	-webkit-box-align: center;
	align-items: center;
}

.flexAlignStart {
	-webkit-align-items: flex-start;
	align-items: flex-start;
}

.flexAlignSelfStart {
	-webkit-align-self: flex-start;
	align-self: flex-start;
}

.flexAlignStretch {
	align-items: stretch;
}

.flexAlignFlexEnd {
	-webkit-align-items: flex-end;
	align-items: flex-end;
}

.flexAlignEnd {
	-webkit-align-items: flex-end;
	align-items: end;
}

.flexFill {
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.flexRight {
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

.flexLeft {
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
}

.displayFlex .flexGrowNone {
	-webkit-flex-grow: 0;
	flex-grow: 0;
}

.flexShrinkNone {
	-webkit-flex-shrink: 0;
	flex-shrink: 0;
}

.displayFlex .flexGrowSome {
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.flexGrow50PercentMore {
	flex-grow: 1.5;
}

.flexGrow100PercentMore {
	flex-grow: 2;
}

.flexShrinkNone {
	flex-shrink: 0;
}

.flexWrap {
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.flexNoWrap {
	flex-wrap: nowrap;
}

.displayFlex .flexShrinkNone {
	-webkit-flex-shrink: 0;
	flex-shrink: 0;
}

.displayFlex .flexShrinkSome {
	-webkit-flex-shrink: 1;
	flex-shrink: 1;
}

.displayFlex label {
	padding-right: 5px;
}

.flexRight button, .flexLeft button:not(:first-child), .flexRight .dropdown, .form-inline button, .flexLeft .dropdown {
	margin-left: 3px;
}

.headerTitle .flexRight {
	align-items: flex-start;
}

.flexBasis50 {
	flex-basis: 50%;
}

.displayGrid {
	display: -ms-grid;
	display: grid;
}

.pageLevelAlertContainer .displayGrid {
	-ms-grid-columns: 1fr 4fr 1fr;
	grid-template-columns: 10% auto 10%;
	justify-items: center;
}

.pageLevelAlertContainer .pageLevelAlert {
	-ms-grid-column: 2;
}

.borderNone {
	border: none;
}

.menuAnchor, .positionRelative {
	position: relative;
}

.positionFixed {
	position: fixed;
}

.positionUnset, .rosterSplitTop .rosterLeftPanel.positionUnset {
	position: static;
	position:unset;

}

.positionFixed, .rosterSplitBottom  #centerPanel.positionFixed {
	position: fixed !important;
}

#centerPanel.ui-resizable {
	position: fixed !important;
}

.verticalAlignMiddle, .alignMiddle {
	vertical-align: middle;
}

.verticalAlignTop, .input-group-btn span.verticalAlignTop, .buttonBar span.verticalAlignTop {
	vertical-align: top;
}

.noBackgroundColor {
	background: none;
	background-image: none;
	background-color: transparent;
}

.backgroundAppColor {
	background-color: #f1f1f2;
	background-position: left top;
	background-repeat: repeat;
}

.backgroundWhite, .navbar-wft .navbar-header, .colorFill {
	background-color: #fff;
}

.fieldsetColor {
	border: 1px solid #999;
	background: #fff;
}

.cursorDefault, .cursorDefault:hover {
	cursor: default;
}

.cursorPointer, div[data-sorttarget], div[data-sorttarget] label, .inputFieldTableReadOnly th div[data-sorttarget] label, .inputFieldDivReadOnly .panel-heading [data-sorttarget] label, .dropdown-toggle {
	cursor: pointer;
}

body.cursorProgress, body.cursorProgress *, body.cursorProgress *:hover {
	cursor: progress !important;
}

.cursorNotAllowed-wft,
.cursorNotAllowed-wft:hover {
	cursor: not-allowed;
}

.suppress {
	float: left;
	height: 100%;
	margin-right: 20px;
	margin-top: 0 !important;
}

@media (max-width: 767px) {
	.mobilePullRight {
		float: right !important;
	}

	.mobilePullLeft.pull-right {
		float: left !important;
	}

	.bodyOverflowHiddenMobile {
		position: fixed;
		overflow: hidden;
	}

	.navMobileActive .mainBody {
		display: none;
	}

	.mobileNonFlex, .displayFlex.mobileNonFlex {
		display: block;
	}

	.col-xs-auto {
		width: auto !important
	}
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
	.hidden-tablet {
		display: none !important;
	}
}

@media screen and (max-width: 1024px) {
	::-webkit-scrollbar {
		-webkit-appearance: none;
	}

	::-webkit-scrollbar:vertical {
		width: 15px;
	}

	::-webkit-scrollbar:horizontal {
		height: 15px;
	}

	::-webkit-scrollbar-thumb {
		background-color: rgba(0, 0, 0, .5);
		border-radius: 4px;
		border: 2px solid #f0f0f0;
	}

	::-webkit-scrollbar-track {
		border-radius: 4px;
		background-color: #f0f0f0;
	}
}

input::-ms-clear {
	display: none;
}

.form-control:-webkit-autofill, .form-control:-webkit-autofill:focus {
	background-color: #fff !important;
	-webkit-box-shadow: 0 0 0 500px white inset;
	-webkit-transition: none !important;
}

.form-control[disabled]:-webkit-autofill, .form-control[disabled]:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 500px #eee inset;
}

.radio-inline {
	width: 100%;
}

.radiobutton {
	width: 100%;
}

.radiobutton label {
	width: 100%;
}

.radiobuttonContainer span label {
	width: 20%
}

.issueDetails {
	background-color: #f2f2f2;
}

.issueData {
	padding: 10px;
}

.issueRecord {
	margin: 5px;
}

.greyBackground {
	background: #eaecff;
}

.smallMargin {
	margin: 10px;
}

.removeMargin {
	margin: -10px;
}

.checkboxTableRow {
	display: flex;
	margin-right: -2px;
	overflow: inherit !important;
	padding-top: 0;
}

.modal-backdrop {
	position: fixed;
}

.jobAllocationLoggingTitle {
	float: left;
	margin-right: 5px;
	padding: 4px;
}

.labelHeader.fontResize.right.hidden-xs {
	max-width: 200px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.paddingRight {
	padding-right: 10px;
}

.largePaddingTop {
	padding-top: 30px;
}

.smallPaddingBottom {
	padding-bottom: 1px;
}

.mainFixedContent.overflowXHidden {
	overflow-x: hidden
}

.zeroZIndex, .zeroZIndex.rosterLeftPanel, .mainNav.zeroZIndex {
	z-index: 0;
}

.zIndex0 {
	z-index: 0;
}

.zIndex1 {
	z-index: 1;
}

.zIndex2, .zIndex1.zIndex2 {
	z-index: 2;
}

svg.svg {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}

@media (max-width: 767px) {
	.userLogin {
		float: none;
		text-align: center;
		margin-top: -5px;
	}

	.institutionTag.btn-link, .institutionTag.btn-link:hover, .institutionTag.btn-link:focus {
		font-size: 95%;
	}

	#jobAllocationLogContainer .col-xs-6.col-sm-3 {
		margin-top: 10px;
	}
}

@media (max-width: 991px) {
	#outboundActivityPopup .col-xs-6.col-sm-6.col-md-2 {
		margin-top: 15px;
	}
}

.strong {
	font-weight: bold;
}

.textCentered {
	text-align: center;
}

.tableGrid.highLight {
	background-color: rgba(1, 118, 178, 0.08) !important;
	overflow: visible;
}

#leftPanel.ui-resizable, #people.ui-resizable, #leftFixedPanel.ui-resizable, #rightPanel.ui-resizable {
	position: fixed !important;
}

#vertical-resizer.ui-resizable-e, #vertical-resizer.ui-resizable-w, #vertical-resizer.ui-resizable-n, #vertical-resizer.ui-resizable-s, #horizontal-resizer-south.ui-resizable-s, #horizontal-resizer-north.ui-resizable-n {
	background: #dedede;
	position: absolute;
}

#horizontal-resizer-north.ui-resizable-n {
	top: -3px;
}

.mainBody #vertical-resizer.ui-resizable-e, .mainBody #vertical-resizer.ui-resizable-w, #rightPanel.ui-resizable-w {
	top: 40px;
	height: calc(100% - 40px);
	width: 5px;
	right: 0;
}

.assignmentTemplates .vertical-resizer {
	margin-right: -8px;
}

.ui-resizable-w .icon-k-splitter-vertical,
.ui-resizable-e .icon-k-splitter-vertical,
.ui-resizable-n .icon-k-splitter-horizontal,
.ui-resizable-s .icon-k-splitter-horizontal {
	z-index: 99;
	color: #2b79c2;
	font-size: 30px;
	position: absolute;
}

.ui-resizable-e .icon-k-splitter-vertical, .rightPanel .icon-k-splitter-vertical {
	left: -12px;
	top: calc(50% - 20px);
}

.ui-resizable-n .icon-k-splitter-horizontal, .ui-resizable-s .icon-k-splitter-horizontal {
	left: calc(50% - 20px);
	top: -12px;
}

.ui-resizable-change, .tableGrid thead th.ui-resizable-change, .smartFilterActive .tableGrid thead th.ui-resizable-change, .smartFilterActive .tableGrid thead th.ui-resizable-change:hover {
	background-color: #1E90FF;
	color: #fff;
}

.center-element {
	display: flex;
	justify-content: center;
	align-items: center;
}

.alertLeftRightMargin {
	margin-top: 10px;
	margin-left: 15px;
	margin-right: 15px;
}

.search-container {
	border: 1px solid #999;
	position: relative;
	box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
	border-radius: 6px;
	padding-right: 0;
}

#buttonsTopContent .search-container {
	padding-right: 0;
}

.searchInputDiv.search-container {
	height: 100%;
	background: #FFFFFF;
	padding-left: 5px;
	border: 1px solid #999;
}

.searchInputDiv.search-container .searchInput {
	padding-left: 0;
	height: 28px;
}

.searchInputDiv.search-container.disabled {
	background: #e8e8e8;
}

.searchInputDiv.search-container.disabled input.searchInput.disabled {
	background: none;
}

.search-container input.form-control {
	width: calc(100% - 20px);
	border: none;
	display: inline-block;
	float: right;
}

.search-container .search-icon {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	color: #898989;
	height: 1.4rem;
}

button .search-icon {
	height: 1.1rem;
	margin: -3px -5px 0 -5px;
}

.dropdown button.dropdown-toggle .search-icon {
	color: #2B79C2;
	position: initial;
	transform: initial;
	margin-left: -5px;
}

.dataTables_filter.search-container .search-icon {
	margin-left: 5px;
}

#tablegrid_ajax_smartTemplates_filter, #tablegrid_ajax_locatePerson_filter, .hasAdvancedSearch .search-container {
	border: none;
}

#tablegrid_ajax_smartTemplates_filter .form-control, #tablegrid_ajax_locatePerson_filter .form-control, .hasAdvancedSearch .search-container input.form-control {
	width: 100%;
	border: 1px solid #999;
	box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
}

.settingsMenu .ukg-icon {
	padding: 3px;
}

#tablegrid_ajax_locatePerson_filter > input:focus {
	box-shadow: 0 0 0 2px #3C96C3;
}